import { left } from "@antv/x6/lib/registry/port-layout/line";

const baseLineOpton = {
  legend: {
    bottom: 0
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '10%',
    containLabel: true
  },
  xAxis: {
    type: 'category',
    data: [],
    axisTick: {
      alignWithLabel: true
    }
  },
  yAxis: {
    type: 'value'
  },
  series: []
}
const baseBarOpton = {
  legend: {
    bottom: 0
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '10%',
    containLabel: true
  },
  xAxis: {
    type: 'value'
  },
  yAxis: {
    type: 'category',
    data: [],
    axisTick: {
      alignWithLabel: true
    }
  },
  series: []
}
const basePieOpton = {
  title: {
    text: '',
    left: '50%',
    textAlign: 'center'
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    type: 'scroll',
    orient: 'vertical',
    top: '10%',
    right: '10%'
  },
  series: [
    {
      name: 'Access From',
      type: 'pie',
      radius: '70%',
      data: [],
      label: {
        formatter: '{b}: {d}%',
      },
      emphasis: {
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      }
    }
  ]
}
export const chartOption = (data, title, type, customConfig = {}) => {
  if (type == 'baseBar') {
    const option = JSON.parse(JSON.stringify(baseLineOpton))
    option.title = {
      text: title,
      left: '50%',
      textAlign: 'center'
    }
    option.xAxis.data = data.xData
    option.series = data.data.map((item, index) => {
      return {
        name: item.name,
        type: 'bar',
        barMaxWidth: 50,
        data: item.data,
        label: {
          show: true,
          // color: '#fff',
          formatter: (params) => params.value + (customConfig?.labelUnit ? customConfig.labelUnit : '')
        }
      }
    })
    return option
  } else if (type == 'horizontalBar') {
    const option = JSON.parse(JSON.stringify(baseBarOpton))
    option.title = {
      text: title,
      left: '50%',
      textAlign: 'center'
    }
    option.yAxis.data = data.xData
    option.series = data.data.map((item, index) => {
      return {
        name: item.name,
        type: 'bar',
        barMaxWidth: 50,
        data: item.data,
        label: {
          show: true,
          // color: '#fff',
          formatter: (params) => params.value + (customConfig?.labelUnit ? customConfig.labelUnit : '')
        }
      }
    })
    return option
  } else if (type == 'stackBar') {
    const option = JSON.parse(JSON.stringify(baseLineOpton))
    option.title = {
      text: title,
      left: '50%',
      textAlign: 'center'
    }
    option.xAxis.data = data.xData
    option.series = data.data.map((item, index) => {
      return {
        name: item.name,
        type: 'bar',
        barMaxWidth: 50,
        data: item.data,
        stack: 'total',
        label: {
          show: true,
          // color: '#fff',
          formatter: (params) => params.value + (customConfig?.labelUnit ? customConfig.labelUnit : '')
        }
      }
    })
    return option
  } else if (type == 'horizontalStackBar') {
    const option = JSON.parse(JSON.stringify(baseBarOpton))
    option.title = {
      text: title,
      left: '50%',
      textAlign: 'center'
    }
    option.yAxis.data = data.xData
    option.series = data.data.map((item, index) => {
      return {
        name: item.name,
        type: 'bar',
        barMaxWidth: 50,
        data: item.data,
        stack: 'total',
        label: {
          show: true,
          // color: '#fff',
          formatter: (params) => params.value + (customConfig?.labelUnit ? customConfig.labelUnit : '')
        }
      }
    })
    return option
  } else if (type == 'baseLine') {
    const option = JSON.parse(JSON.stringify(baseLineOpton))
    option.title = {
      text: title,
      left: '50%',
      textAlign: 'center'
    }
    if (customConfig.min) {
      option.yAxis.min = customConfig.min
    } else {
      delete option.yAxis.min
    }
    // option.yAxis.min = 0.5
    option.xAxis.data = data.xData
    option.series = data.data.map((item, index) => {
      return {
        name: item.name,
        type: 'line',
        data: item.data,
        label: {
          show: true,
          // color: '#fff',
          // formatter: (params) => params.value + '%'
        }
      }
    })
    return option
  } else if (type == 'basePie') {
    const option = JSON.parse(JSON.stringify(basePieOpton))
    option.title.text = title
    option.series[0].data = data
    return option
  }
}
